import React, { useEffect, useState } from 'react';
import { Button, Modal } from 'antd';
import { connect } from 'react-redux';
import {  Checkbox, Form, Input } from 'antd';
import type { RadioChangeEvent } from 'antd';
import { Radio } from 'antd';

export const EditModel = ({props,editmodel,closeedit,editindex,edititem,dispatch}: any) => {
    const [form] = Form.useForm()
    useEffect(()=>{
        form.setFieldsValue({
            title:edititem.title,
            floor_num:edititem.floor_num
        })
    },[edititem])
    const onFinish = (values: any) => {
        // console.log('Success:', values);
        closeedit(false);
        dispatch({type:'sand/EDITS',payload:{...values,editindex}})
      };
      
      const onFinishFailed = (errorInfo: any) => {
        // console.log('Failed:', errorInfo);
      };
  const [isModalOpen, setIsModalOpen] = useState(false);

  const showModal = () => {
    setIsModalOpen(true);
  };

  const handleOk = () => {
    closeedit(false);
  };

  const handleCancel = () => {
    closeedit(false);
  };
  const [value, setValue] = useState(1);

  const onChange = (e: RadioChangeEvent) => {
    // console.log('radio checked', e.target.value);
    setValue(e.target.value);
  };

  return (
    <div>
      <Modal
        title="编辑"
        open={editmodel}
        onOk={handleOk}
        onCancel={handleCancel}
        footer={null}
      >
         <Form
    name="basic"
    labelCol={{ span: 8 }}
    wrapperCol={{ span: 16 }}
    style={{ maxWidth: 600 }}
    initialValues={{ remember: true }}
    onFinish={onFinish}
    form={form}
    onFinishFailed={onFinishFailed}
    
    autoComplete="off"
  >
     <Form.Item label="楼盘名称" name="title">
            <Input />
          </Form.Item>
          <Form.Item label="单元数">
            <Input />
          </Form.Item>
          <Form.Item label="电梯数">
            <Input />
          </Form.Item>
          <Form.Item label="总楼层" name="floor_num">
            <Input />
          </Form.Item>
          <Form.Item label="总户数" name="room_num">
            <Input />
          </Form.Item>
          <Form.Item label="销售状态" name="sale_status">
            <Radio.Group onChange={onChange} value={value}>
              <Radio value={1}>在售</Radio>
              <Radio value={2}>未售</Radio>
              <Radio value={3}>售完</Radio>
            </Radio.Group>
          </Form.Item>
   
 
    <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
      <Button type="primary" htmlType="submit">
        确定
      </Button>
      <Button type="primary" htmlType="submit" style={{marginLeft:'20px'}}>
        取消
      </Button>
    </Form.Item>
  </Form>
        
      </Modal>
    </div>
  );
};

const mapStateToProps = (state: any) => ({});

export default connect(mapStateToProps)(EditModel);
